<script>
// 组件的导出
export default {
  name: "HelloWorld", // 组件的名称
  props: {
    msg: String,
  },
  data() {
    return {
      text: "hello world",
    };
  },
  methods: {
    change() {
      this.text = "hello vue3";
    },
  },
  onMounted() {
    console.log("mounted");
  },
};
</script>

<template>
  <h1>{{ msg }}</h1>
  <p>{{ text }}</p>
  <button @click="change">改变 text</button>
</template>

<style scoped>
.read-the-docs {
  color: #888;
}
</style>
